import {computed, ref, toRefs} from 'vue';
import type { Ref } from 'vue';
import { SetupStoreId } from '@/enum';
import { defineStore } from 'pinia';
import { getNaiveTheme, initThemeSettings } from '@/store/modules/theme/shared';


/** 主题设置 */
const settings: Ref<App.Theme.ThemeSetting> = ref(initThemeSettings());

/** 主题颜色 */
const themeColors = computed(() => {
    const { themeColor, otherColor, isInfoFollowPrimary } = settings.value;
    const colors: App.Theme.ThemeColor = {
        primary: themeColor,
        ...otherColor,
        info: isInfoFollowPrimary ? themeColor : otherColor.info
    };
    return colors;
});

/**
 * 更新主题颜色
 * @param key
 * @param color
 */
const updateThemeColors = (color: string, key?: App.Theme.ThemeColorKey, ) => {
    settings.value.themeColor = color;
}

/** 设置主题 */
const setThemeScheme = (scheme: UnionKey.ThemeScheme) => {
    settings.value.themeScheme = scheme;
}

export const useThemeStore = defineStore(SetupStoreId.Theme, () => {

    const naiveTheme = computed(() => getNaiveTheme(themeColors.value));

    return {
        ...toRefs(settings.value),
        naiveTheme,
        updateThemeColors,
        setThemeScheme
    }
});
